<template>
  <uni-nav-bar title="加注机" left-icon="left" color="#333" @clickLeft="navBack" statusBar></uni-nav-bar>
  <!-- 说明性标题 -->
  <Explain :text="text"></Explain>
  <!-- 加注机详情头部 -->
  <FillingTop :fillAll="fillAll"></FillingTop>
  <!-- 菜单 -->
  <MenuBar :list="list"></MenuBar>
</template>

<script setup lang="ts">
import { fillDetail } from '@/gql/customer';
import { navBack } from '@/utils/navigator';
import Explain from '@c/customers/explain.vue';
import FillingTop from '@c/customers/fillingTop.vue';
import MenuBar from '@c/customers/menuBar.vue';
import { onLoad } from '@dcloudio/uni-app';
import { toPublish } from '@mqtt';
import { ref } from 'vue';

// static
const text = ref(uni.getStorageSync('customersName') + '授权加注机');
const list = ref([{ text: '订单', path: '/pages/customers/orderList' }]);
const fillAll = ref({}); //加注机详情
let fillID = null as number; //加注机ID

onLoad((options) => {
  fillID = Number.parseInt(options.id);
  fillSever();
});

function fillSever() {
  const payload = {
    query: fillDetail,
    variables: { fill_id: fillID },
  };
  toPublish('customers/fill', payload, (obj: any) => {
    const { fill } = obj.data;
    fillAll.value = fill;
    list.value = [{ text: '订单', path: `customers/orderList?id=${fillID}&type=${fill.name}` }];
  });
}
</script>

<style scoped lang="less"></style>
